<template>
  <div>
<ve-line :data="chartData" height="100%" :extend="chartExtend"></ve-line>
  </div>
</template>

<script>
export default {
  name: "DataViewA1",
  data () {
    return {
      chartExtend:{
        title: {
          text:'成绩分段线性图',
          textAlign:'center',
          left:'center'
        },
        xAxis:{
          name:'分数',
          nameTextStyle: {
            fontSize: 18,
          }
        },
        yAxis:{
          name:'人数',
          position:'left',
          nameTextStyle: {
            fontSize: 18,
          }
        },
        legend:{
          show: false
        }
      },
      chartData: {
        columns: ['x','y'],
        rows: []
      },
    }
    },
  methods:{
    getData(){
      this.$axios.post('/getA1Data',{classId:this.classId})
      .then(res=>{
        this.chartData.rows=res.data;
      })
    }
  },
  mounted() {
    if(this.classId!=='')
      this.getData();
  },
  watch:{
    classId(){
      this.getData();
    }
  }
  ,
  props:["classId"]
}
</script>

<style scoped>

</style>
